<template>
  <div class="header-con row justify-center items-center q-col-gutter-x-md" :style="{ backgroundColor: colors.primary, borderBottom: '1px solid ' + colors.secondary }">
    <q-img
      src="statics/elliot@2x.png"
      spinner-color="white"
      style="height: 50px; width: 50px"
    />
    <strong class="text-white text-body1">Admin</strong>
    <q-icon name="person" size="1.8em" color="orange"/>
  </div>
</template>

<script>
import { mapGetters } from 'vuex'
export default {
  // name: 'LayoutName',
  data () {
    return {
    }
  },
  computed: {
    ...mapGetters('theme', {
      colors: 'colors'
    })
  }
}
</script>

<style lang="stylus" scoped>
  .header-con
    height 120px
</style>
